<template>
  <view class="container screen-width">
    <u-tabs :list="tabList" :current="current" height="100" item-width="274" @change="handleChange"></u-tabs>
    <scroll-view class="list" :scroll-y="true" @scrolltolower="fetchData()">
      <block v-if="current === 0">
        <view
          class="flex items-middle space-between person-list"
          v-for="(item,index) in list"
          :key="index"
        >
          <view class="flex items-middle">
            <u-avatar class="u-m-r-40" size="120" :src="$imgUrl + item.avatar"></u-avatar>
            <view class="person-info">
              <view class="name">{{item.name}}</view>
              <view class="company">{{item.companyName}}</view>
              <view class="company">{{item.createTime}}</view>
            </view>
          </view>
          <u-icon name="arrow-right" color="#1678FF"></u-icon>
        </view>
        <view
          class="add-btn screen-width"
          @tap="createCard"
        >{{ userInfo.whetherExistBusinessCard ? "我的名片" : "添加名片"}}</view>
      </block>
      <block v-else>
        <view
          class="flex items-middle space-between person-list"
          v-for="(item,index) in list"
          :key="index"
          @click="toCompanyDetail(item)"
        >
          <view class="flex items-middle">
            <u-avatar class="u-m-r-40" size="120" :src="$imgUrl + item.companyLogo"></u-avatar>
            <view class="person-info">
              <view class="name">{{item.companyName}}</view>
              <view class="company">{{item.slogan}}</view>
            </view>
          </view>
          <u-icon name="arrow-right" color="#1678FF"></u-icon>
        </view>
      </block>
      <u-loadmore
        bg-color="#ffffff"
        style="width: 100%;  margin-top: 15rpx;  padding-right: 30rpx"
        :status="status"
      />
    </scroll-view>
    <Festival></Festival>
  </view>
</template>

<script>
import { userInfo, getCardList } from "../../util/api/user";
import { collectList } from "../../util/api/company";
export default {
  data() {
    return {
      current: 0,
      tabList: [
        {
          name: "个人名片",
          count: 5
        },
        {
          name: "企业名片",
          count: 0
        }
      ],
      params: {
        pageNo: 1,
        pageSize: 15
      },
      status: "loadmore",
      list: [],
      userInfo: {}
    };
  },
  onLoad() {
    this.getUserInfo();
    this.fetchData();
  },
  methods: {
    // tab切换
    handleChange(index) {
      this.current = index;
      this.fetchData(true);
    },
    // 查看是否有个人名片
    async getUserInfo() {
      const data = await userInfo();
      this.userInfo = data.result;
    },
    getPromise() {
      switch (this.current) {
        case 0:
          return getCardList(this.params);
        case 1:
          return collectList(this.params);
      }
    },
    fetchData(reset = false) {
      if (reset) {
        this.resetPagination();
      }
      uni.showLoading();
      this.status = "loading";
      this.getPromise().then(res => {
        uni.hideLoading();
        this.$nextTick(() => {
          let records = res.result.records;
          this.tabList[this.current]["count"] = res.result.total;
          if (!records.length) {
            this.status = "nomore";
            return;
          }
          this.list = reset ? records : this.list.concat(records);
          this.params.pageNo += 1;
          this.status = "loadmore";
        });
      });
    },
    resetPagination() {
      this.params.pageNo = 1;
      this.list = [];
      this.status = "loadmore";
    },
    // 去企业详情
    toCompanyDetail(item) {
      uni.navigateTo({
        url: `/pages/enterpriseDetails/brand_detail?id=${item.companyId}&type=1&liIndex=0&showNew=true`
      });
    },
    // 创建名片或编辑
    createCard() {
      if (this.userInfo.whetherExistBusinessCard) {
        uni.navigateTo({
          url: "/pages/person/CardList"
        });
      } else {
        uni.navigateTo({
          url: "/pages/person/editCard?isEdit=" + 0
        });
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.container {
  height: 100%;
  max-height: 100%;
  background: #ffffff;
  .list {
    padding: 0 15px;
    box-sizing: border-box;
    .person-list {
      height: 200rpx;
      border-bottom: 1rpx solid #ebebeb;
      .person-info {
        .name {
          color: #1678ff;
          font-size: 16px;
          font-weight: 700;
        }
        .company {
          font-size: 12px;
          font-weight: 400;
          color: #aaaaaa;
          margin-top: 5px;
        }
      }
    }
    .add-btn {
      background: #1678ff;
      color: #fff;
      height: 88rpx;
      line-height: 88rpx;
      text-align: center;
      position: fixed;
      bottom: 0;
      width: 100%;
    }
  }
}
</style>
